<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>编辑商品</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="__PUBLIC__/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="__PUBLIC__/layuiadmin/style/admin.css" media="all">
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <!--<style>
        /*.layui-upload-img { width: 90px; height: 90px; margin: 0; }*/
        .pic-more { width:100%; left; margin: 10px 0px 0px 0px;}
        .pic-more li { width:90px; float: left; margin-right: 5px;}
        .pic-more li .layui-input { display: initial; }
        .pic-more li a { position: absolute; top: 0; display: block; }
        .pic-more li a i { font-size: 24px; background-color: #008800; }
        #slide-pc-priview .item_img img{ width: 90px; height: 90px;}
        #slide-pc-priview li{position: relative;}
        #slide-pc-priview li .operate{ color: #000; display: none;}
        #slide-pc-priview li .toleft{ position: absolute;top: 40px; left: 1px; cursor:pointer;}
        #slide-pc-priview li .toright{ position: absolute;top: 40px; rightright: 1px;cursor:pointer;}
        #slide-pc-priview li .close{position: absolute;top: 5px; rightright: 5px;cursor:pointer;}
        #slide-pc-priview li:hover .operate{ display: block;}
    </style>-->
</head>
<body>

<div class="layui-fluid" id="component-tabs">
    <div class="layui-col-md12">
    <div class="layui-card">
        <div class="layui-card-body" style="padding: 15px;height: 500px">
            <form class="layui-form" action="" lay-filter="component-form-group" id="myform" action="javascript:;">
                <div class="layui-tab layui-tab-brief" lay-filter="component-tabs-hash">
                    <ul class="layui-tab-title">
                        <li class="layui-this" lay-id="11">基本信息</li>
                        <li lay-id="22">商品相册</li>
                        <li lay-id="33">商品详情</li>
                    </ul>
                    <input type="hidden" id="go_id" name="go_id" value="{$find.go_id}">
                    <div class="layui-tab-content" style="height: 165px;">
                        <div class="layui-tab-item layui-show">
                            <div class="layui-form-item">
                                <label class="layui-form-label">商品名称</label>
                                <div class="layui-input-block">
                                    <input type="text" name="go_name" value="{$find.go_name}" id="name" lay-verify="" autocomplete="off" placeholder="请输入商品名" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-inline">
                                    <label class="layui-form-label">选择分类</label>
                                    <div class="layui-input-inline" style="z-index:1000">
                                        <select name="parent" lay-verify="required" lay-search="">
                                            <option value="1" {if 1 == $parent.ca_parent} selected {/if}>特价</option>
                                            <option value="2" {if 2 == $parent.ca_parent} selected {/if}>抢先兑</option>
                                        </select>
                                    </div>
                                    <div class="layui-input-inline" style="z-index:1000">
                                        <select name="go_caid" lay-verify="required" lay-search="">
                                            {volist name='class' id='data'}
                                            {if $data.ca_parent == 1}
                                            <option value="{$data.ca_id}" {if $data.ca_id == $find.go_caid} selected {/if}>{$data.ca_name}——特价</option>
                                            {elseif $data.ca_parent == 2}
                                            <option value="{$data.ca_id}" {if $data.ca_id == $find.go_caid} selected {/if}>{$data.ca_name}——抢先兑</option>
                                            {/if}
                                            {/volist}
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-inline">
                                    <label class="layui-form-label">使用积分</label>
                                    <div class="layui-input-inline">
                                        <input type="text" name="go_score" value="{$find.go_score}" id="score" autocomplete="off" placeholder="请输入所需积分" class="layui-input">
                                    </div>
                                    <label class="layui-form-label">现金</label>
                                    <div class="layui-input-inline">
                                        <input type="text" name="go_price" value="{$find.go_price}" id="price" autocomplete="off" placeholder="请输入所需现金" class="layui-input">
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">设置</label>
                                <div class="layui-input-block">
                                    <div class="layui-col-md12">
                                        <input type="checkbox" name="go_sale" value="1" title="上架" {if 1 == $find.go_sale} checked {/if}>
                                        <input type="checkbox" name="go_recom" value="1" title="推荐" {if 1 == $find.go_recom} checked {/if}>
                                        <input type="checkbox" name="go_new" value="1" title="新品" {if 1 == $find.go_new} checked {/if}>
                                        <input type="checkbox" name="go_hot" value="1" title="促销" {if 1 == $find.go_hot} checked {/if}>
                                        <input type="checkbox" name="go_free" value="1" title="包邮" {if 1 == $find.go_free} checked {/if}>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-inline">
                                    <label class="layui-form-label">库存</label>
                                    <div class="layui-input-inline" style="display: flex;align-items:center">
                                        <input type="text" name="go_stock" value="{$find.go_stock}" autocomplete="off" placeholder="请输入库存" class="layui-input">&nbsp;件
                                    </div>
                                    <label class="layui-form-label">销量</label>
                                    <div class="layui-input-inline"  style="display: flex;align-items:center">
                                        <input type="text" name="go_sum" value="{$find.go_sum}" autocomplete="off" placeholder="请输入销量" class="layui-input">&nbsp;件
                                    </div>
                                    <label class="layui-form-label">产品重量</label>
                                    <div class="layui-input-inline"  style="display: flex;align-items:center">
                                        <input type="text" name="go_weight" value="{$find.go_weight}" autocomplete="off" placeholder="请输入产品重量" class="layui-input">&nbsp;克
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">商品关键字</label>
                                <div class="layui-input-block">
                                    <input type="text" name="go_key" value="{$find.go_key}" lay-verify="" autocomplete="off" placeholder="请输入商品关键字" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">商品简介</label>
                                    <div class="layui-input-block">
                                        <textarea name="go_con" lay-verify="" placeholder="请输入商品简介" class="layui-textarea">{$find.go_con}</textarea>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-tab-item">
                            <div class="layui-form-item">
                                <label class="layui-form-label">文章封面</label>
                                <div class="layui-upload">
                                    <button type="button" class="layui-btn" id="test1">上传图片</button>
                                    <input type="hidden" name="headImg" id="headImg" value="{$find.go_thumb}">
                                    <div class="layui-upload-list">
                                        <img class="layui-upload-img" src="{$find.go_thumb}" id="demo1" width="200" style="padding-left: 100px;">
                                        <p id="demoText"></p>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">商品图集</label>
                                <div class="layui-upload">
                                    <div class="layui-upload-list">
                                        {volist name='find.go_imgs' id='vo'}
                                        <img class="layui-upload-img" src="{$vo}" width="100">
                                        {/volist}
                                    </div>
                                </div>
                            </div>
                            <div class="layui-card">
                                <div class="layui-card-body">
                                    <div class="layui-upload">
                                        <button type="button" class="layui-btn" id="test-upload-more">商品封面上传</button>
                                        <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
                                            预览图：
                                            <div class="layui-upload-list" id="test-upload-more-list">
                                                <input type="hidden" name="imgs" id="imgs">
                                            </div>
                                        </blockquote>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-tab-item">
                            <div class="layui-form-item">
                                <label class="layui-form-label">内容详情</label>
                                <div class="layui-input-block">
                                    <script id="container" name="go_body" type="text/plain" style="height: 250px">{$find.go_body|htmlspecialchars_decode}</script>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item layui-layout-admin">
                        <div class="layui-input-block">
                            <div class="layui-footer" style="left: 0;">
                                <button class="layui-btn"  lay-filter="component-form-demo1" onclick="sub()" type="button">立即提交</button>
                                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
    </div>
</div>

<script src="__PUBLIC__/layuiadmin/layui/layui.js"></script>
<script type="text/javascript" src="__PUBLIC__/caidongweb/lib/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="__PUBLIC__/caidongweb/lib/ueditor/ueditor.all.js"> </script>
<!--<script type="text/javascript" src="js/plupload/plupload.full.min.js"></script>
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>-->

<script type="text/javascript">
    var ue = UE.getEditor('container');
</script>
<script>
    layui.config({
        base: '__PUBLIC__/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'form', 'laydate'], function(){
        var $ = layui.$
            ,admin = layui.admin
            ,element = layui.element
            ,router = layui.router()
            ,layer = layui.layer
            ,laydate = layui.laydate
            ,form = layui.form
            ,upload = layui.upload;

        element.render();

        element.on('tab(component-tabs-brief)', function(obj){
            layer.msg(obj.index + '：' + this.innerHTML);
        });

        /* 触发事件 */
        var active = {
            tabAdd: function(){
                /* 新增一个Tab项 */
                element.tabAdd('demo', {
                    title: '新选项'+ (Math.random()*1000|0) /* 用于演示 */
                    ,content: '内容'+ (Math.random()*1000|0)
                    ,id: new Date().getTime() /* 实际使用一般是规定好的id，这里以时间戳模拟下 */
                })
            }
            ,tabDelete: function(othis){
                /* 删除指定Tab项 */
                element.tabDelete('demo', '22');
                othis.addClass('layui-btn-disabled');
            }
            ,tabChange: function(){
                /* 切换到指定Tab项 */
                element.tabChange('demo', '33');
            }
        };

        //多图片上传
        upload.render({
            elem: '#test-upload-more'
            ,url: '{:url("Goods/uploads",["id"=>2])}'
            ,multiple: true
            ,before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#test-upload-more-list').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img">')
                });
            }
            ,done: function(res){
                var src = $("[name=imgs]").val();
                if(src == ''){
                    $("[name=imgs]").val(res.src);
                }else{
                    var sr = src+','+res.src;
                    $("[name=imgs]").val(sr);
                }
            }
        });

        $('#component-tabs .site-demo-active').on('click', function(){
            var othis = $(this), type = othis.data('type');
            active[type] ? active[type].call(this, othis) : '';
        });
    });
    function sub()
    {
        $.ajax({
            type:'post',
            url:'{:url("Goods/good_edit")}',
            data:$("#myform").serialize(),
            dataType:'json',
            success: function (data) {
                if(data.code>0){
                    //上传成功
                    layer.msg(data.msg,{icon:6,time:1500});
                    setTimeout(function(){parent.location.reload()},1500);
                }else{
                    layer.msg(data.msg, {icon: 5, time: 1000});
                }
            },
            error: function (data) {
                console.log(data.msg);
            },
        });
    }
    //封面上传
    layui.use('upload', function() {
        var $ = layui.jquery
            , upload = layui.upload;

        var id = $("[name=id]").val();
        var url = '{:url("Goods/uploads")}';
        //普通图片上传
        var uploadInst = upload.render({
            elem: '#test1'
            , url: url
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#demo1').attr('src', result); //图片链接（base64）
                });
            }
            , done: function (res) {
                //如果上传失败
                if(res.code < 0){
                    return layer.msg(res.msg);
                }else{
                    //上传成功
                    layer.msg(res.msg);
                    $("[name=headImg]").val(res.src);
                }
            }
            , error: function () {
                //演示失败状态，并实现重传
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function () {
                    uploadInst.upload();
                });
            }
        });
    });
</script>
</body>
</html>
